哈囉大家好今天會來示範GridLayout,他和前一天介紹的TableLayout有些類似,不過他有些地方和TableLayout不同,廢話不多說那我們就開始今天的示範吧!
在貼程式碼之前,我先來介紹一下大概會用到的程式碼:
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:columnCount="5"
android:orientation="horizontal"
android:rowCount="8">
<Button
android:text="btn1"
android:layout_row="0"
android:layout_column="0"
/>
<Button
android:text="btn2"
android:layout_row="0"
android:layout_column="1"
/>
<Button
android:text="btn3"
android:layout_row="0"
android:layout_column="2"
/>
<Button
android:text="btn4"
android:layout_row="0"
android:layout_column="3"
/>
<Button
android:text="btn5"
android:layout_row="0"
android:layout_column="4"
/>
<Button
android:text="btn6"
android:layout_row="1"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_gravity="fill"
/>
<Button
android:text="btn7"
android:layout_row="1"
android:layout_column="2"
android:layout_columnSpan="3"
android:layout_gravity="fill"
/>
<Button
android:text="btn8"
android:layout_row="2"
android:layout_column="0"
android:layout_gravity="fill"
/>
<Button
android:text="btn9"
android:layout_column="1"
android:layout_row="2"
android:layout_columnSpan="2"
android:layout_rowSpan="2"
android:layout_gravity="fill"
/>
<Button
android:text="btn10"
android:layout_column="3"
android:layout_row="2"
android:layout_columnSpan="2"
android:layout_rowSpan="3"
android:layout_gravity="fill"
/>
<Button
android:text="btn11"
android:layout_row="3"
android:layout_column="0"
android:layout_gravity="fill"
/>
<Button
android:text="btn12"
android:layout_row="4"
android:layout_column="0"
android:layout_columnSpan="3"
android:layout_gravity="fill"/>
<Button
android:text="btn13"
android:layout_row="5"
android:layout_column="3"
android:layout_columnSpan="2"
android:layout_gravity="fill"
/>
<Button
android:text="btn14"
android:layout_row="6"
android:layout_columnSpan="5"
android:layout_gravity="fill"
/>
</GridLayout>
在程式碼裡為了方便計算元件在第幾行第幾列我將每一個按鈕都設定了layout_row和layout_column,然後讀者如果有跟著上面的程式碼一起做的話會發現在第6行的第1到第3列有空白,不是我忘記指定元件而是我故意而為的,相信大家在練習完後會對於GridLayout有基本的認識了,那今天的示範就到此為止了,謝謝大家耐心地觀看。